<template>
  <div style="display: flex; flex-direction: column; flex: 1">
    <header class="search">
      <el-input placeholder="操作名字" v-model="data.name" clearable @keyup.enter="getLogList" />
      <el-input clearable v-model="data.createEmp" @keyup.enter="getLogList" placeholder="操作人" />
      <div class="filter">
        <HButton type="primary" @click="getLogList">
          <el-icon>
            <Search />
          </el-icon>
          搜索
        </HButton>
      </div>
    </header>
    <div style="flex: 1; position: relative">
      <el-table :data="dataTable" style="position: absolute" :border="true" height="100%">
        <el-table-column prop="name" show-overflow-tooltip label="事件" />
        <el-table-column prop="content" show-overflow-tooltip label="操作内容" />
        <el-table-column prop="createEmp" show-overflow-tooltip label="操作人" />
        <el-table-column prop="createTime" show-overflow-tooltip label="操作时间" />
      </el-table>
    </div>

    <div class="footer">
      <Pagination
        ref="paginDom"
        :list_total="total"
        @size-change="getLogList"
        @current-change="getLogList"
      />
    </div>
  </div>
</template>
<script setup lang="ts">
  import { ref, onMounted, reactive } from 'vue'
  import { useRoute } from 'vue-router'
  import { ElMessage } from 'element-plus'
  import { loggetList } from '@/api/code'
  import Pagination from '@/components/Pagination/index.vue'
  import { Search } from '@element-plus/icons-vue'
  import HButton from '@/components/common/button/HButton.vue'

  const route = useRoute()
  const paginDom = ref()
  const total = ref()
  const emit = defineEmits(['loading-false'])
  const props = defineProps({
    //子组件接收父组件传递过来的值
    codedetail: Object,
  })
  const dataTable = ref(null)
  const data = reactive({
    createEmp: '',
    limit: 0,
    name: '',
    page: 0,
  })
  onMounted(() => {
    getLogList()
  })
  const getLogList = () => {
    data.page = paginDom.value.current
    data.limit = paginDom.value.size
    loggetList(data, route.params.id).then((res) => {
      if (res.data.code == 20000) {
        dataTable.value = res.data.data.rows
        total.value = Number(res.data.data.total) || 0
      } else {
        if(res.data.isError) ElMessage({
          message: res.data.message,
          type: 'error',
          duration: 4000,
        })
      }
      emit('loading-false', false)
    })
  }
</script>
<style lang="scss" scoped>
  @import './index.scss';
</style>
